<!-- 公告组件 -->
<template>
<div class='announcement'>
  <div class="birthdaydate cards">
    生日是：2015-10-05
  </div>
  <div class="Interestlist cards">
    <div>您的兴趣</div>
    <hr>
    <div style="text-align: left;">
      <h4>java</h4>
      <span>........</span>
    </div>
    <div style="text-align: left;">
      <h4>java</h4>
      <span>........</span>
    </div>
    <div style="text-align: left;">
      <h4>java</h4>
      <span>........</span>
    </div>
  </div>
  <div class="systemnotice cards">
    <div style="border-bottom: 1px solid;">系统公告</div>
    <div style="text-align: left;">
      <h4>1.今天纪念日</h4>
      <h4>2.今天纪念日</h4>
      <h4>3.今天纪念日</h4>
      <h4>4.今天纪念日</h4>
    </div>
  </div>
</div>
</template>

<script lang='ts'>

import { defineComponent } from 'vue'

export default defineComponent({
  name: '',
  props: {
    msg: String
  },

  setup () {
    return {
    }
  }
})
</script>

<style scoped lang='scss'>
h4{
  margin-top: 10px;
  margin-bottom: 5px;
  cursor: pointer;
}
.announcement{
  width: 300px;
  min-width: 300px;
  text-align: center;
  margin-right: 30px;
}
.cards {
  box-shadow: 0px 1px 18px rgba(90, 90, 90,.2);
  border-radius: 5%;
  border: 1px solid rgba(90, 90, 90,.1);
  padding: 5px;
  color: #696969;
  margin-bottom: 30px;
}
.birthdaydate{
  padding: 10px;
}
</style>
